<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>课程管理</title>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/left.css">
    <link rel="stylesheet" href="css/jquery.dialogbox.css">
    <script src="js/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <script src="js/vue.js"></script>
    <script src="js/jquery.dialogBox.js"></script>
    <script>
        $(function () {
            var vue = new Vue({
                el:'#app',
                data:{
                    pages:1,
                    <!-- 调整分页数据,查询参数设置-->
                    param:{restype:0,subId:0,coaId:0,stuId:0,page:1,rows:8,isCoach:0},
                    url:'http://localhost:8889',
                    reverses:[],
                    subjects:[],
                    coachs:[],
                    students:[],
                    res:[],
                },
                methods:{
                    queryAllRes:function(){
                        var that = this;
                        $.getJSON(that.url+'/student/queryAllRes',function(data){
                            that.res = data;

                        })

                    },
                    query:function () {
                        var that = this;
                        var info = {
                            page:that.param.page,
                            rows:that.param.rows,
                        }
                        if(that.param.subId>0){
                            info.subId = that.param.subId;

                        }
                        var roleCoaId = localStorage.getItem("role_id")
                        if(roleCoaId>0&&roleCoaId!=null){
                            that.param.coaId = roleCoaId
                            that.param.isCoach = 1
                        }

                        if(that.param.coaId>0){
                            info.coaId = that.param.coaId;

                        }
                        if(that.param.stuId>0){
                            info.stuId = that.param.stuId;

                        }
                        info.resType = 2;
                        $.getJSON(that.url+'/student/queryreverse',info,function(data){
                            console.log(data);
                            that.reverses = data.list;
                            that.pages =  data.pages;
                        })
                    },
                    getSubjects:function(){
                        var that = this;
                        $.getJSON(that.url+"/Subject/query",function(data){
                            that.subjects = data;

                        })
                    },
                    getCoach:function(){
                        var that = this;
                        $.getJSON(that.url+"/coach/findAll",function(data){
                            that.coachs = data;

                        })
                    },
                    getStudent:function(){
                        var that = this;
                        $.getJSON(that.url+"/student/findAll",function(data){
                            that.students = data;

                        })
                    },

                    <!--分页函数-->
                    setpage:function(page){
                        this.param.page = page;
                        this.query();
                    },
                    <!--重置函数-->
                    reset:function () {
                        this.param.subId = 0;
                        this.param.stuId = 0;
                        this.param.coaId = 0;
                        this.query();
                    },
                    getDate(n) {

                        var ss = 24 * 60 * 60 * 1000; //一天的毫秒数86400

                        var timestamp = new Date().getTime(); //获取当前时间戳

                        var date1 = new Date(ss * n + timestamp) //加上n天的国际标准日期

                        var newTime = date1.toLocaleString(); //把日期转换成2018/6/4 下午10:45:19 格式

                        var arr = newTime.split(" "); //把2018/6/4提取出来

                        var arr2 = arr[0].split('/'); //把年月日数字单独提出来

                        return arr2[0] + '-' + arr2[1] + '-' + arr2[2]; //拼接成我们需要的格式返回

                    },
                    remove:function(id,classId,teaTime){
                        console.log(id)
                        console.log(classId)
                        console.log(teaTime)
                        var that = this
                        var info ={
                            id:id,
                            classId:classId
                        }
                        var date = new Date();
                        //var resDate = date.getFullYear()+"-0"+(date.getMonth()+1)+"-"+date.getDate();
                        var nowDate = date.getDate();
                        var resDate = teaTime.substring(8);
                        console.log(nowDate)
                        console.log(resDate)
                        if(Math.abs(resDate-nowDate)<=1){
                            //alert("时间已经超时，不可以取消预约")
                            /*$('#type-delBox').dialogBox({
                                hasClose: true,
                                    hasBtn: true,
                                    width: 300,
                                    height: 200,
                                    confirmValue: '确认',
                                    confirm: function(){

                                    },
                                cancelValue: '取消',
                                    title: '提醒',
                                    content: '确认删除！'
                            });*/
                            $('#type-delBox').dialogBox({

                                autoHide: true,
                                time: 2000,
                                width:300,
                                height:60,
                                content: '时间已经超时，不可以取消预约！'
                            });

                         }else{
                            $('#type-delBox').dialogBox({
                                    hasClose: true,
                                    hasBtn: true,
                                    width: 300,
                                    height: 200,
                                    confirmValue: '确认',
                                    confirm: function(){
                                        $.getJSON(that.url+"/reverse/remove",info,function(data){
                                            if(data){
                                                $('#type-delBox').dialogBox({
                                                    autoHide: true,
                                                    time: 2000,
                                                    width:300,
                                                    height:60,
                                                    content: '取消预约成功！'
                                                });
                                                that.query();
                                            }else{
                                                $('#type-delBox').dialogBox({
                                                    autoHide: true,
                                                    time: 2000,
                                                    width:300,
                                                    height:60,
                                                    content: '取消预约失败！'
                                                });
                                            }
                                        })
                                    },
                                    cancelValue: '取消',
                                    title: '提醒',
                                    content: '你确定取消预约吗！'
                                });

                        }

                    },
                    update:function(id,classId,teaTime){

                        var that = this
                        var info ={
                            id:id,
                            classId:classId
                        }
                        var date = new Date();
                        //var resDate = date.getFullYear()+"-0"+(date.getMonth()+1)+"-"+date.getDate();
                        var nowDate = date.getDate();
                        var resDate = teaTime.substring(8);
                        if((resDate-nowDate)<1){
                            alert("当天信息无法改签成功，请与驾校联系")
                        }else{
                            $.getJSON(that.url+"/reverse/remove",info,function(data){
                                if(data){
                                    location.href="classinfoes.html";
                                }else{
                                    alert("改签失败失败")
                                }
                            })
                        }

                    }

                }
            })
            vue.query();
            vue.getSubjects();
            vue.queryAllRes();
            vue.getCoach();
            vue.getStudent();
            $("#header").load("header.html");
            $("#left").load("left.html");
        })
    </script>
    <style type="text/css" media="screen">
        .bg {
            background:url(images/subject/bg2.jpg) no-repeat center fixed;
            background-size:100%;
        }
        .bgcon{

            background: white;
            opacity:0.9;
        }
        .thead{
            border-bottom: #00FF00;
        }
        .tithead{
            margin-left:5px;
            margin-bottom: 30px;
        }
        .remark{
            margin-bottom: 20px;
            margin-right: 10px;
            color: #737373;
        }
    </style>
</head>
<body>
<div class="container-fluid bgcon" id="app">
    <div class="row" id="header">

    </div>
    <div class="row">
        <div class="col-md-2" id="left">

        </div>
        <div class="col-md-9" style="margin-left:30px;margin-top:10px">
            <div class="row tithead"><h3 class="glyphicon glyphicon glyphicon-bed"> 预约信息管理</h3></div>
            <div class="row" style="margin-top: 15px">
                <div class="col-md-2">
                    <select v-model="param.subId" class="form-control">
                        <option value="0">请选择科目</option>
                        <option v-for="s in subjects" :value="s.subId">{{s.subType}}</option>
                    </select>
                </div>

                <div class="col-md-2">
                    <select v-model="param.coaId" class="form-control">
                        <option value="0">教练姓名</option>
                        <option v-for="c in coachs" :value="c.coaId">{{c.coaName}}</option>
                    </select>
                </div>

                <div class="col-md-2">
                    <select  v-model="param.stuId" class="form-control">
                        <option value="0">学员姓名</option>
                        <option v-for="s in students" :value="s.stuId">{{s.stuName}}</option>
                    </select>
                </div>

                <div class="col-md-3">
                    <button @click="reset" class="btn btn-default" style="margin-right:10px">
                        <i class="glyphicon glyphicon-repeat"></i> 重置
                    </button>
                    <button @click="query" class="btn btn-primary">
                        <i class="glyphicon glyphicon-search"></i> 查询
                    </button>
                </div>
            </div>
            <div class="row" style="margin-top: 15px">
                <div class="col-md-12">
                    <div class="table-responsive">
                        <table class="table table-bordered table-hover">
                            <thead class="thead">
                            <tr>
                                <th width="8%" class="text-center">序号</th>
                                <th width="10%" class="text-center">预约学员</th>
                                <th width="7%" class="text-center">性别</th>
                                <th width="10%" class="text-center">电话</th>
                                <th width="7%" class="text-center">预约科目</th>
                                <th width="7%" class="text-center">预约教练</th>
                                <th width="10%" class="text-center">预约时间</th>
                                <th width="10%" class="text-center">场次</th>
                                <th width="10%" class="text-center">开始时间</th>
                                <th width="8%" class="text-center">课时</th>
                                <th class="text-center" colspan="3">操作</th>
                            </tr>
                            </thead>
                            <tbody v-for="(r,index) in reverses">
                                <tr v-for="(cil,cindex) in r.classInfoList" class="text-center" style="height:47px">
                                    <td>{{index+cindex+1}}</td>
                                    <td>{{r.stuName}}</td>
                                    <td v-if="r.stuSex === 1">男</td>
                                    <td v-else-if="r.stuSex === 0">女</td>
                                    <td>{{r.phone}}</td>
                                    <td>{{cil.subject.subType}}</td>
                                    <td>{{cil.coach.coaName}}</td>
                                    <td>{{cil.teaTime}}</td>
                                    <td>{{cil.classSess}}</td>
                                    <td v-if="cil.classSess=='上午场'">9:00</td>
                                    <td v-if="cil.classSess=='下午场'">14:00</td>
                                    <td>{{cil.classHour}}</td>
                                    <!--<td>-->
                                        <!--<button @click="update(r.reverseList[cindex].id,cil.classId,cil.teaTime)" class="btn btn-sm btn-warning">改签</button>-->
                                    <!--</td>-->
                                    <td>
                                        <button v-if="param.isCoach ==0" @click="remove(r.reverseList[cindex].id,cil.classId,cil.teaTime)" class="btn btn-sm btn-danger">取消预约</button>
                                        <button v-if="param.isCoach ==1"  class="btn btn-sm btn-warning">联系学员</button>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="row">
                <div class="col-md-12 text-center">
                    <nav aria-label="Page navigation">
                        <ul class="pagination" style="margin: 0">
                            <li @click="setpage(1)">
                                <a href="#" aria-label="Previous">
                                    <span aria-hidden="true">&laquo;</span>
                                </a>
                            </li>
                            <li v-for="p in pages" @click="setpage(p)">
                                <a href="#">{{p}}</a>
                            </li>
                            <li @click="setpage(pages)">
                                <a href="#" aria-label="Next">
                                    <span aria-hidden="true">&raquo;</span>
                                </a>
                            </li>
                        </ul>
                    </nav>
                </div>
            </div>
            <div class="row text-right remark"><h5>备注：预约信息详细展示. </h5></div>
        </div>
    </div>
</div>
<div id="type-delBox"></div>
</body>
</html>